import React, { useState, useEffect } from 'react';
import { subject_list } from "../../api/niu";
import "./SubjectClassification.scss"

interface Props { }
interface DataType {
    data: any
}

function SubjectClassification(props: Props) {

    // 数据源
    var [subjectData, setSubjectData] = useState<DataType[]>([])
    var subjectlist = async () => {
        var res = await subject_list();
        console.log(res.data)
        setSubjectData(res.data);
    }
    useEffect(() => {
        subjectlist();
    }, [])

    return (
        <div className='subjectClassification'>
            {/* 主题分类 */}
            <div className='subjectClassification-itemBox'>
                {
                    subjectData.map((item, index) => {
                        return (
                            <div className="subjectClassification-item" key={index}>
                                <div>{item.data}</div>
                            </div>
                        )
                    })
                }
                <div className='subjectClassification-all'>显示全部</div>
            </div>
        </div>
    )
}

export default SubjectClassification;